<template>
  <div>
    <div name="header" id="header" class="obpm-header">
      <div class="table_noborder obpm-topbar d-flex">
        <div class="obpm-topbar-title pl-4">{{myappsTitle}}</div>
        <div class="admin-bg01"></div>
        <div class="admin-bg02"></div>
        <div class="admin-bg03"></div>
        <div class="admin-bg04"></div>
        <div class="obpm-topbar-info pr-4">
          <template v-if="!(isSecret || isExamine)">
            <router-link class="obpm-topbar-homepage pr-2" :title="$t('home')" tabindex  to='/home' v-if="showMainLink && hiddenLink">{{$t('home')}}</router-link>
          </template>
          <a class="obpm-topbar-logout pr-2 obpm-topbar-help" :title="$t('loginout')"  @click="loginout" v-if="hiddenLink">{{$t('loginout')}}</a>
          <a class="obpm-topbar-help" id="helpLink" tabindex :title="$t('closeHelp')"  @click="closeHelp">{{$t('closeHelp')}}</a>
        </div>
      </div>
      <el-drawer
        title="域基本信息帮助:"
        :visible.sync="drawer"
        :direction="direction"
        :before-close="handleClose">
        <div>
          <h5>当前任务描述</h5>
          <p>域信息的维护页面</p>
        </div>
        <div>
          <h5>功能说明</h5>
          <p><span>域名称：</span>设置域的名称</p>
          <p><span>状态：</span>设置域状态为激活或者不激活。若为激活，则前台可正常登录。否则无法正常登录</p>
          <p><span>描述：</span>设置域描述信息</p>
          <p><span>短信发送编码：</span>短信端口的唯一标识。需要系统发送短信到手机时使用。通常由ISP提供（如有需要可联系天翎客服人员）</p>
          <p><span>短信发送密码：</span>通常由ISP提供（如有需要可联系天翎客服人员）</p>
          <p><span>皮肤：</span>设置域前端登录的风格。可分为default、fresh、green、gray、blue（支持自定义）</p>
          <p><span>保存：</span>保存当前页面信息</p>
          <p><span>退出：</span>返回域列表界面</p>

        </div>
      </el-drawer>
    </div>
    <div class="obpm-header-location" v-if="showBreadCrumb">
      <el-breadcrumb separator="/" class="obpm-header-nav" ref="top2" v-if="isCanExit">
      <template v-if="isSecret || isExamine">
        <el-breadcrumb-item>{{$t('location')}}</el-breadcrumb-item>
      </template>
      <template v-else>
        <el-breadcrumb-item :to="{ path: '/home' }">{{$t('location')}}</el-breadcrumb-item>
      </template>
      <template v-if="desc==$t('enterprise_list')">
        <template v-if="isSecret || isExamine">
          <el-breadcrumb-item>{{desc}}</el-breadcrumb-item>
        </template>
        <template v-else>
          <el-breadcrumb-item :to="{ path:'/main' }">{{desc}}</el-breadcrumb-item>
        </template>
      </template>
      <template v-else>
        <el-breadcrumb-item  @click.native="breadCrumbClick(desc)" style="cursor:pointer;">{{desc}}</el-breadcrumb-item>
      </template>

      <el-breadcrumb-item v-if="detail" class="last-breadcrumb">{{detail===$t('baseInfo')?$store.state.domainName:detail}}</el-breadcrumb-item>
      </el-breadcrumb>
      <el-breadcrumb separator="/" class="obpm-header-nav" ref="top2" v-if="!isCanExit">
        <el-breadcrumb-item v-if="showPartMenu">{{$t('location')}}</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main' }">{{desc}}</el-breadcrumb-item>
        <el-breadcrumb-item v-if="detail" class="last-breadcrumb">{{detail}}</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
  </div>
</template>

<script>
import {getCookie, setCookie} from '../utils'
export default {
  data() {
    return {
      drawer: false,
      direction: 'rtl',
      showMainLink: true,
      hiddenLink: true, // 隐藏主页和注销
      myappsTitle: '',
      isSecret:false, //是否是安全保密员
      isExamine:false,//是否是安全审计员
    };
  },
  props:{
    isCanExit:{
      type: Boolean,
      default: true
    },
    detail:{
      type: String,
    },
    showBreadCrumb:{
      type: Boolean,
      default: true
    },
    desc:{
      type: String,
    },
    showPartMenu: {
      type: Boolean,
      default: true
    }
  },
  created(){
    let mt = obpmLogoConfig.APP_NAME
    if(mt.indexOf("TK_") > -1) {
      this.myappsTitle = mt.replace(/TK_/, '')
    }else {
      this.myappsTitle = this.$t('myappsTitle')
    }
    // 判断当前是哪一个用户登录看是否显示主页
    if(sessionStorage.getItem('onlyDomainUser')){
      this.showMainLink = false
    }
    // 判断当前的是部门管理员的就鞥路
    if(this.$route.query.from == 'systemManagement'){
      this.hiddenLink = false
    }
    if(this.$store.state.currentUser && this.$store.state.currentUser.isOpenSecurity) {
      if(this.$store.state.currentUser.type == 'secret'){
        this.isSecret = true;//是否是安全保密员
      }
      else if(this.$store.state.currentUser.type == "examine"){
        this.isExamine = true;//是否是安全审计员
      }
    }
  },
  
  methods:{
    //对不同的页面进行处理
    breadCrumbClick(name){
       if(this.$t('super_user_list')||this.$t('system_monitoring')){
          this.$emit('breadCrumbClick',name)
       }
    },
    closeHelp(){
      this.drawer=true;
    },
    handleClose(done) {
      done()
    },
    loginout(){
      this.$api.LogOut({
        onSucess: response => {
          if (response.data.errmsg == "ok") {
            window.sessionStorage.setItem("vuex","")
            this.$router.push("/login");
           // 重新设置为中文
            setCookie('domainLanguage', 'zh', 1)
            this.$i18n.locale = getCookie('domainLanguage')
            sessionStorage.removeItem('onlyDomainUser')
            sessionStorage.removeItem('domainData')
          }else{
            this.$message({
              showClose: true,
              message: response.data.errmsg,
              type: "error"
            });
          }
        }
      });
    }
    
  },
};
</script>
